<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Insert title here</title>
    <link rel="stylesheet" href="__PUBLIC__/js/bootstrapvalidator/css/bootstrapValidator.min.css" />
	<link rel="stylesheet" href="__PUBLIC__/js/jquery-upload/css/jquery.fileupload.css" />
	<link rel="stylesheet" href="__PUBLIC__/js/jquery-upload/css/jquery.fileupload-ui.css" />
 	<script type="text/javascript" src="__PUBLIC__/js/jquery-upload/js/vendor/jquery.ui.widget.js"></script>
 	<script type="text/javascript" src="__PUBLIC__/js/jquery-upload/js/jquery.fileupload.js"></script>
 	<script type="text/javascript" src="__PUBLIC__/js/jquery-upload/js/jquery.fileupload-ui.js"></script>
 	<script type="text/javascript" src="__PUBLIC__/js/jquery-upload/js/jquery.iframe-transport.js"></script>
 	<script type="text/javascript" src="__PUBLIC__/js/jquery-upload/js/jquery.fileupload-process.js"></script>
 	<script type="text/javascript" src="__PUBLIC__/js/bootstrapvalidator/js/bootstrapValidator.min.js"></script>
</head>
<body>
	<div class="modal-dialog" role="document" style="width:800px;">
	    <div class="modal-content">
	        <div class="modal-header">
	            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
	            <h4 class="modal-title" id="exampleModalLabel"><if condition="$id">修改会议室<else/>添加会议室</if></h4>
	        </div>
	        <form class="form-horizontal" style="padding:4%;height:350px;overflow-y:auto;" id="meetingRoomForm">
				<input type="hidden" name="token" value="{$formToken}">
	        	<input type="hidden" name="id" value="{$id}"/>
				<div class="form-group">
					<label class="control-label col-sm-2">会议室编号:</label>
					<div class="col-sm-4">
						<input type="text" class="form-control" name="room_no" value="{$meetingRoom.room_no}" placeholder="请输入会议室编号">
					</div>
					<label class="control-label col-sm-2">会议室名称:</label>
					<div class="col-sm-4">
						<input type="text" class="form-control" name="name" value="{$meetingRoom.name}" placeholder="请输入会议室名称">
					</div>
				</div>
				<div class="form-group">
					<label class="control-label col-sm-2">所属空间:</label>
					<div class="col-sm-4">
						<select class="form-control" name="space_id" id="space_id">
							<foreach name="spaceList" item="space">
								<option value="{$space.id}" <if condition="$meetingRoom['space_id'] eq $space['id']">selected</if>>{$space.name}</option>
							</foreach>
						</select>
					</div>
					<label class="control-label col-sm-2">座位数:</label>
					<div class="col-sm-4">
						<input type="text" class="form-control" name="seating" value="{$meetingRoom.seating}" placeholder="请输入会议室座位数">
					</div>
				</div>
				<div class="form-group">
					<label class="control-label col-sm-2">投影:</label>
					<div class="col-sm-4">
						<input type="checkbox" name="_is_projector" value="{$meetingRoom.is_projector|default="1"}" />
						<input type="hidden" name="is_projector" value="{$meetingRoom.is_projector|default="1"}" />
					</div>
					<label class="control-label col-sm-2">需要预约:</label>
					<div class="col-sm-4">
						<input type="checkbox" name="_is_order" value="{$meetingRoom.is_order|default="1"}" />
						<input type="hidden" name="is_order" value="{$meetingRoom.is_order|default="1"}" />
					</div>
				</div>
				<div class="form-group">
					<label class="control-label col-sm-2">审批:</label>
					<div class="col-sm-4">
						<input type="checkbox" name="_is_approve" value="{$meetingRoom.is_approve|default="0"}" />
						<input type="hidden" name="is_approve" value="{$meetingRoom.is_approve|default="0"}" />
					</div>
					<label class="control-label col-sm-2">是否启用:</label>
					<div class="col-sm-4">
						<input type="checkbox" name="_status" value="{$meetingRoom.status|default="1"}" />
						<input type="hidden" name="status" value="{$meetingRoom.status|default="1"}" />
					</div>
				</div>
				<div class="form-group">
					<label class="control-label col-sm-2">最大预约时长:</label>
					<div class="col-sm-4">
						<div class="input-group">
							<input type="text" class="form-control" name="max_order_time" value="{$meetingRoom.max_order_time}" placeholder="请输入最大预约时长">
							<div class="input-group-addon">小时</div>
						</div>
					</div>
					<label class="control-label col-sm-2">超额单价:</label>
					<div class="col-sm-4">
						<div class="input-group">
							<input type="text" class="form-control" name="unit_price" value="{$meetingRoom.unit_price}" placeholder="请输入超额单价">
							<div class="input-group-addon">元/小时</div>
						</div>
					</div>
				</div>
	        </form>
	        <div class="modal-footer">
	            <button type="button" data-dismiss="modal" class="btn btn-default">取消</button>
	            <button type="button" id="save" class="btn btn-primary">保存</button>
	        </div>
	    </div>
	</div>
    
	<script type="text/javascript">
		var webRoot = "__ROOT__";
		$(function(){
			$("#save").bind("click",doSave);
            initSwitchOption("_is_projector","有","无","{$meetingRoom.is_projector|default="1"}");
            initSwitchOption("_is_order","是","否","{$meetingRoom.is_order|default="1"}");
            initSwitchOption("_is_approve","是","否","{$meetingRoom.is_approve|default="0"}");
            initSwitchOption("_status","是","否","{$meetingRoom.status|default="1"}");
		});

		function initSwitchOption(name,onText,offText,state) {
            var switchOption = {
                onText: onText,
                offText: offText,
                onColor: "success",
                offColor: "info",
                state: state == 1 ? true : false,
                onSwitchChange: function (event, state) {
                    if (state == true) {
                        $(this).val("1");
                    } else {
                        console.log(state);
                        $(this).val("0");
                    }
                    var value = $(this).val();
                    $("input:hidden[name='"+name.substring(1)+"']").val(value);
                }
            };
            $("input:checkbox[name='"+name+"']").bootstrapSwitch(switchOption);
        }
		
		var commitFlag = false;
		function doSave(){
			if(commitFlag){
				common.alert("提示","请勿重复提交");
				return;
			}
			commitFlag = true;
			if(!validateForm()){
				commitFlag = false;
				return false;
			}
			$.ajax({
                url: "{:U('Admin/Space/MeetingRoom/doSave')}",
                type: "post",
                dataType: "json",
                data: $("#meetingRoomForm").serialize(),
                success: function (data) {
                    if(data.status){
                    	common.alert("提示",data.msg,function(){
                            common.reload();
                        });
                    }else{
                    	commitFlag = false;
                    	common.alert("提示",data.msg);
                    }
                }
            });
		}

		function validateForm(){
			$('#meetingRoomForm').bootstrapValidator({
				feedbackIcons: {
            　　　　　　　　		valid: 'glyphicon glyphicon-ok',
            　　　　　　　　		//invalid: 'glyphicon glyphicon-remove',
            　　　　　　　　		validating: 'glyphicon glyphicon-refresh'
        　　　　　　　　 	},
	            fields: {
                    room_no: {
                        validators: {
                            notEmpty: {
                                message: '会议室编号不能为空'
                            }
                        }
					},
	            	name: {
	                    validators: {
	                        notEmpty: {
	                            message: '会议室名称不能为空'
	                        }
	                    }
	                },
                    space_id: {
                        validators: {
                            notEmpty: {
                                message: '所属空间不能为空'
                            }
                        }
					},
                    seating: {
	                    validators: {
	                        notEmpty: {
	                            message: '座位数不能为空'
	                        },
                            regexp: {
                                regexp: /^\+?[1-9][0-9]*$/,
                                message: '座位数必须为整数'
                            }
	                    }
	                },
                    max_order_time: {
                        validators: {
                            regexp: {
                                regexp: /((^[1-9]+[0-9]*)|^0)(\.\d{0,2})?$/,
                                message: '最大预约时长必须为数字，最多2位小数'
                            }
                        }
					},
                    unit_price: {
                        validators: {
                            regexp: {
                                regexp: /((^[1-9]+[0-9]*)|^0)(\.\d{0,2})?$/,
                                message: '超额单价必须为数字，最多2位小数'
                            }
                        }
                    }
	            }
	        });
			var data = $('#meetingRoomForm').data('bootstrapValidator');
		    if (data) {
		        data.validate();
		        if (!data.isValid()) {
		            return false;
		        }
		    }
		    return true;
		}
	</script>
</body>
</html>